<template>
  <a-sub-menu :key="nav.path">
    <template #title>
      <span><Icon :type="nav.meta.icon" /><span>{{ nav.meta.title }}</span></span>
    </template>
    <template v-for="item in nav.children">
      <a-menu-item v-if="!item.children" :key="item.path" :title="item.meta.title">
        <span><Icon :type="nav.meta.icon" />{{ item.meta.title }}</span>
      </a-menu-item>
      <sub-menu v-else :key="item.path" :nav="item" />
    </template>
  </a-sub-menu>

</template>

<script lang="ts">
import { defineComponent } from 'vue'

export default defineComponent({
  name: 'SubMenu',
  props: {
    nav: {
      type: Object,
      default: () => ({})
    }
  },
  setup() {
  }
})
</script>

<style>

</style>
